
import {Component} from 'react';

class InputComponent extends Component{

    constructor(props){
        super(props);
        console.log(this)

        this.state={
            name:"",
            age:""
        }
    }

    handleChange=(e)=>{
        //得到上输入控件的名字
       let name =e.target.name;
        this.setState({
          [name]:e.target.value
       }); 
    }

    handleClick=(e)=>{
        //console.log(this.state);
        this.setState({
            name:"",
            age:""
        })
        this.props.getdata({...this.state})

    }

    render(){
        let {name,age}=this.state
        return (
            <div>
                <label>
                    姓名：
                    <input type='text' value={name} name='name' onChange={this.handleChange}></input>
                </label>
                <label>
                    年龄：
                    <input type='text' value={age} name='age' onChange={this.handleChange}></input>
                </label>
                <button onClick={this.handleClick}>添加</button>
            </div>
        )
    }
}

export default InputComponent